import { MyVue } from '@/common/MyVue';
import { Component } from "vue-facing-decorator";
import { UserService } from '@/service/UserService';
import LoggerUtil from '@/utils/LoggerUtil';
import Constant from '@/constant/Constants';
@Component
export default class Share extends MyVue {
    userQrcode: string = '';
    posterData = {
        imgs: [{
            imgResource: 'https://media-cdn.threeperson.com/static/share_bg_01.jpeg',
            x: 0,
            y: 0,
            width: 750,
            height: 1334,
            zIndex: 1,
            type: 2
        }, {
            imgResource: '',
            x: 245,
            y: 680,
            width: 270,
            height: 270,
            zIndex: 3,
            type: 2,
            borderRadius: 0
        }],
        blocks: [{
            width: 750,
            height: 1334,
            x: 0,
            y: 0,
            backgroundColor: '#F1F4FA'
        }],
        texts: []
    };
    isReady: boolean = false;
    filePath: string = '';
    cdnHost = Constant.cdnHost;

    ready() {
        LoggerUtil.info('fui-poster component is ready');
        this.isReady = true;
    }

    previewImage() {
        uni.previewImage({
            urls: [this.filePath]
        });
    }

    generatePoster() {
        LoggerUtil.info('generatePoster called, isReady:', this.isReady);
        if (this.isReady) {
            if (this.filePath) {
                LoggerUtil.info('Using existing poster:', this.filePath);
                this.previewImage();
            } else {
                LoggerUtil.info('Generating new poster with data:', this.posterData);
                uni.showLoading({
                    title: '正在生成...'
                });
                (this.$refs.generator as any).generatePoster(this.posterData, (res: string) => {
                    LoggerUtil.info('Poster generated successfully:', res);
                    this.filePath = res;
                    this.previewImage();
                    uni.hideLoading();
                });
            }
        } else {
            LoggerUtil.info('Component not ready yet');
            uni.showToast({
                title: '组件尚未初始化完成！',
                icon: 'none'
            });
        }
    }

    share(e: any) {
        LoggerUtil.info('分享功能');
    }

    async onLoad() {
        uni.setNavigationBarTitle({
            title: '分享海报'
        });
        await this.loadUserInfo();
    }

    async loadUserInfo() {
        try {
            const user = await UserService.getUser();
            this.userQrcode = this.cdnHost+user.qrcode || '';
            this.posterData.imgs[1].imgResource = this.userQrcode;
            LoggerUtil.info('User qrcode loaded:', this.userQrcode);
        } catch (error) {

            LoggerUtil.error('Failed to load user info:', error);
            uni.showToast({
                title: '获取用户信息失败',
                icon: 'none'
            });
        }
    }

    onShareAppMessage() {
        return {
            title: '自然笔记',
            path: '/pages/share/share',
            imageUrl: this.filePath || 'https://media-cdn.threeperson.com/static/share_bg_01.jpeg'
        };
    }
}
